import axios from "@/utils/requestzz";
import uuidv1 from "uuid/v1";

let zz = {
  watch: {},
  methods: {
    beijing() {
      // axios.get("/model/model").then(res => {
      //   if (res.code == 200) {

      //     let geojson = res.data.data
      //     console.log(geojson);

      this.beijing11()
      //   }
      // })
    },
    beijing11() {
      // axios.get("/model/model").then(res =>{
      //   if (res.code == 200) {

      //     console.log(JSON.parse(res.data.data));
      //   }
      // })

      require("@/views/tongyong/ThreeDimensional/components/PolylineTrail");


      let _this = this;
      var viewer = this._earth.czm.viewer;

      // console.log(dataa);C:\Users\Administrator\Desktop\FOUR\daping_front_8083\public\configuration\beijing\beijing.json

      var promise = Cesium.GeoJsonDataSource.load('/configuration/beijing/beijing.json');
      promise.then(function (dataSource) {
        viewer.dataSources.add(dataSource);
        var entities = dataSource.entities.values;

        for (var o = 0; o < entities.length; o++) {
          var entity = entities[o];

          //删除默认提示框
          entity.billboard = undefined;

          //判断点
          if (entity.id.split(".")[0] == "heatplant" || entity.id.split(".")[0] == "boiler" || entity.id.split(".")[0] == "measuredpoint") {
            //特殊点
            //热源厂 需要区分隔压站 锅炉房 热源
            // switch (entity.properties._type._value) {
            //   case "隔压站":
            //   case "燃气锅炉房":
            //   case "热电厂":

            let imgpath = ''

            switch (entity.id.split(".")[0]) {
              case 'heatplant':
                imgpath = 'redianchang-01'
                break;
              case 'boiler':
                imgpath = 'guolufang-01'
                break;
              case 'measuredpoint':
                imgpath = 'geyazhan-01'
                break;
              default:
                imgpath = 'newFactory'
                break;
            }

            let nameid =
              entity.id +
              "|" +
              entity.properties.pid._value +
              "|" +
              entity.position._value;

            let ln = Cesium.Cartographic.fromCartesian(
              entity.position._value
            );

            let uniqueID = uuidv1();
            _this._earth.sceneTree.root.children.push({
              ref: uniqueID,
              czmObject: {
                customProp: "ghjghj",
                xbsjType: "Pin",
                xbsjGuid: "96f2033d-55cf-4677-b8c7-bde52f14b054",
                name: nameid,
                position: [ln.longitude, ln.latitude, ln.height],
                scale: 0.6,
                // disableDepthTestDistance: 0,
                imageUrl: `/configuration/logo/${imgpath}.png`,
                // _this.pointericon[entity.properties._type._value],
                pinBuilder: {},
                far: 1073741824
              }
            });

            // _this.pinarr.push(uniqueID);
            // }
            // }
            //     break;
            //   default:
            //     break;
            // }
          } else if (
            entity.id.split(".")[0] == "substation" ||
            entity.id.split(".")[0] == "tee"
          ) {
            //普通点------------------------------------------------------------------------------
            //热力站
            if (
              // entity.id.split(".")[0] == "tee" ||
              entity.id.split(".")[0] == "substation"
            ) {
              //判断视角高度
              //判断是否已经显示
              //普通点
              //------------------------------------++++++++++++++++++++++++++++++
              if (entity.properties.name._value != "") {
                if (
                  entity.properties.name._value.indexOf("T") == -1 &&
                  entity.properties.name._value.indexOf("V") == -1
                ) {
                  entity.point = new Cesium.PointGraphics({
                    color: Cesium.Color.fromCssColorString("#5D96B799"),
                    pixelSize: 20,
                    distanceDisplayCondition: new Cesium.DistanceDisplayCondition(
                      10.0,
                      52820.0
                    ),
                    scaleByDistance: new Cesium.NearFarScalar(
                      500,
                      2,
                      52820,
                      0.01
                    )
                    // translucencyByDistance: 100,
                    // disableDepthTestDistance: 100.0
                  });
                }
              }
            }
          } else if (entity.id.split(".")[0] == "pipeline") {
            //-------------------------------------------------------------------------------------------------------------------------------
            //添加 ODline
            // entity.polyline = undefined;

            entity.polyline = {
              positions: entity.polyline.positions._value,
              width: 8,
              material: new Cesium.PolylineTrailLinkMaterialProperty(
                Cesium.Color.fromCssColorString("#b399ff"),
                50000
              ),
              clampToGround: true,
              distanceDisplayCondition: new Cesium.DistanceDisplayCondition(
                0,
                500000
              )
              // scaleByDistance: new Cesium.NearFarScalar(500, 5, 52820, 0.001),
            };
          }
        }
      })

      //添加点击事件
      viewer.screenSpaceEventHandler.setInputAction(function onLeftClick(
          movement
        ) {
          var pickedFeature = viewer.scene.pick(movement.position);

          if (typeof pickedFeature != "undefined") {
            if (pickedFeature.id.properties == undefined) {
              _this.pointerclickbeijing({
                id: pickedFeature.id.name.split("|")[0],
                pid: pickedFeature.id.name.split("|")[1],
                position: Cesium.Cartographic.fromCartesian(
                  pickedFeature.id.position._value
                )
              });
            } else {
              _this.pointerclickbeijing({
                id: pickedFeature.id.id,
                pid: pickedFeature.id.properties.pid._value,
                position: Cesium.Cartographic.fromCartesian(
                  pickedFeature.id.position._value
                )
              });
            }
          }
        },
        Cesium.ScreenSpaceEventType.LEFT_CLICK);

    },

    pointerclickbeijing(options) {
      //获取接口数据
      //数据返回显示弹窗
      //判断id
      let type =
        options.id.split(".")[0] == "substation" ? "substation" : "heatplant";
      let pid = options.pid;

      let requestBody = {
        // 热源
        queries: [{
          metric: "pid,name,m_001t,m_001p,m_002p,m_001q",
          schema: "monitor"
        }],
        table: "HeatPlant",
        search: "pid=" + pid
      };
      if (type == "substation") {
        requestBody = {
          // 热力站
          queries: [{
            metric: "pid,name,m_001t,m_001p,m_002p,m_003q,m_003opening",
            schema: "monitor"
          }],
          table: "SubStation",
          search: "pid=" + pid
        };
      }

      if (this.ishistory == "历史") {
        requestBody = {
          queries: [{
            metric: "pid,name,m_001t,m_001p,m_002p,m_001q",
            schema: "monitor"
          }],
          table: "HeatPlant",
          search: "pid=" + pid,
          type: "history",
          startTime: this.timerangarr[0].getTime(),
          endTime: this.timerangarr[1].getTime()
        };
        if (type == "substation") {
          requestBody = {
            // 热力站
            queries: [{
              metric: "pid,name,m_001t,m_001p,m_002p,m_003q,m_003opening",
              schema: "monitor"
            }],
            table: "SubStation",
            search: "pid=" + pid,
            type: "history",
            startTime: this.timerangarr[0].getTime(),
            endTime: this.timerangarr[1].getTime()
          };
        }
      }

      // axios.post("/open/queryDb", requestBody).then(res => {
      //   //如果有则获取200中的结果
      //   let data = res.data;
      let html = "";
      //   if (data['200'].length != 0) {
      //     if (type == "heatplant") {

      //     }

      //     if (type == "substation") {

      //     }
      //   } else {

      //   }

      let uniqueID = uuidv1();
      options.uid = uniqueID;
      options.diahtml = html;

      // this.msgboxarr.push({ uid: uniqueID, diahtml: html, options: options });
      this.dependlistArr.cardpointbeijing.push({
        uid: uniqueID,
        options: options
      });
      // });
    }
  },


  addmarkbeijing() {
    this._pinDivTool = new XE.Obj.Plots.GeoPin(this._earth);

    this._pinDivTool.innerHTML =
      `
        <!DOCTYPE HTML>
        <html>

        <head>
            <title></title>
            <style>
                .contain {
                    position: absolute;
                    height: 235px;
                    width: 586px;
                    left: 2px;
                    top: -242px;
                    color: white;
                    background-size: 100% 100%;
                    padding: 5px;
                    border-radius: 5px;
                    cursor: pointer;
                    background-image: url('/configuration/ziyuan/dialog.png');
                }
                .textContain {
                    position: absolute;
                    cursor: pointer;
                    line-height: 15px;
                    top: 20px;
                    bottom: 0px;
                    left: 190px;
                    color: white;
                    padding: 22px;
                }
                .textItem {
                    display: block;
                    font-size: 14px;
                    color: #ffffff;
                    line-height: 22px;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    display: -webkit-box;
                    -webkit-line-clamp: 7;
                    -webkit-box-orient: vertical;
                }
                @keyframes scale {
                    0% {
                        transform: scale(1)
                    }
                    50%,
                    75% {
                        transform: scale(3)
                    }
                    78%,
                    100% {
                        opacity: 0
                    }
                }
                @keyframes scales {
                    0% {
                        transform: scale(1)
                    }
                    50%,
                    75% {
                        transform: scale(2)
                    }
                    78%,
                    100% {
                        opacity: 0
                    }
                }
                .smallcircle {
                    position: absolute;
                    width: 12px;
                    height: 12px;
                    background-color: #56bcd6;
                    opacity: 0.8;
                    border-radius: 50%;
                    top: -4px;
                    left: -6px;
                }
                .smallcircle:before {
                    content: '';
                    display: block;
                    width: 12px;
                    height: 12px;
                    border-radius: 50%;
                    opacity: .4;
                    background-color: #56bcd6;
                    opacity: 0.8;
                    animation: scale 1s infinite cubic-bezier(0, 0, .49, 1.02);
                }
                .bigcircle {
                    position: absolute;
                    width: 12px;
                    height: 12px;
                    border-radius: 50%;
                    opacity: .4;
                    background-color: #56bcd6;
                    opacity: 0.8;
                    animation: scales 1s infinite cubic-bezier(0, 0, .49, 1.02);
                    top: -4px;
                    left: -6px;
                }
            </style>
        </head>
        <body>
            <div class="contain">
                <div style="position: absolute; top: 7px; left: 202px;"><span style="font-size: 16px; color: #ffe799;">项目详情</span>
                <span style="display: inline-block; width: 14px; height: 12px; background: url(/configuration/ziyuan/arrow.png) no-repeat; background-size: 100% 100%; margin-left: 6px;"></span></div>
                <div class="textContain"><span class="textItem">` +
      `
        <span style="font-size: 14px;color:#ffffff">${this.ziyuankv[each_point.name]}智慧综合能源系统</span><br>
        <span style="font-size: 12px;color:#ffffff;opacity:0.6">
          CPU： 50%<br/>
          内存：80%<br/>
          硬盘： 50%
        </span>
      ` +
      `</span></div>
            </div>
            <div class="smallcircle"></div>
            <div class="bigcircle"></div>
        </body>
        </html>
      `;


    this._pinDivTool.position = [each_point.position[0], each_point.position[1], 1000]
  }
}

export default zz;
